﻿@model Services.User
@{
    ViewBag.Title = "UserInfo";
    Layout = "~/_Layout.cshtml";
}

<h2>UserInfo</h2>
@using (Html.BeginForm("EditUser", "User", FormMethod.Post, new { @user = Model }))
{
    <input type="hidden" name="hobbies" id="hobbies" />
    <div id="div_userInfo">
        <table class="tab">
            <tr>
                <td colspan="2">个人信息</td>
            </tr>
            <tr>
                <td>账号:</td>
                <td>@Html.TextBoxFor(p => p.Uid)</td>
            </tr>
            <tr>
                <td>密码:</td>
                <td>@Html.TextBoxFor(p => p.Pwd)</td>
            </tr>
            <tr>
                <td>姓名:</td>
                <td>@Html.TextBoxFor(p => p.Name)</td>
            </tr>
            <tr>
                <td>生日:</td>
                <td>@Html.TextBoxFor(p => p.Birthday)</td>
            </tr>
            <tr>
                <td>QQ:</td>
                <td>@Html.TextBoxFor(p => p.QQ)</td>
            </tr>
            <tr>
                <td>邮箱:</td>
                <td>@Html.TextBoxFor(p => p.Email)</td>
            </tr>
            <tr>
                <td>电话:</td>
                <td>@Html.TextBoxFor(p => p.Phone)</td>
            </tr>
            <tr>
                <td>爱好:</td>
                <td>
                    <table class="tab" id="tab_hobbies">
                    </table>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <input type="submit" class="btn" id="btn_submit" onclick="submitForm();" value="保存" />
                    <input type="button" class="btn" id="btn_back" value="返回" />
                </td>
            </tr>
        </table>
    </div>
}
<script type="text/javascript">
    var tag = '@ViewData["tag"].ToString()'
    if (tag == "info") {
        $("#div_userInfo input[type=text]").each(function () {
            $(this).attr("readonly", "true");
        })

        $("#btn_submit").css("display", "none");
    }
    if (tag == "edit") {

    }

    $("#btn_back").click(function () {
        var url = '@Url.Action("UserList", "User")'
        window.location.href = url;
    })

    //hobbies
    function InitHobbies() {
        var ho = '@Model.Hobbies'
        var html = "";
        if (ho == "") {
            html = "<tr><td><input type='text' /></td><td><a tag='add' onclick='addTr(this);'>Add</a>   <a tag='del' onclick='delTr(this);'>Delete</a></td></tr>";
        }
        else {
            var arr = ho.split(',');
            for (var i = 0; i < arr.length; i++) {
                html += "<tr>";
                if (tag == "edit") {
                    html += "<td><input type='text' value='" + arr[i] + "' /></td>";
                    html += "<td><a tag='add' onclick='addTr(this);'>Add</a>   <a tag='del' onclick='delTr(this);'>Delete</a></td>";
                }
                if (tag == "info") {
                    html += "<td><input type='text' value='" + arr[i] + "' readonly='readonly' /></td>";
                }
                html += "</tr>";
            }
        }
        $("#tab_hobbies").append($(html));
    }

    function addTr(obj) {
        var html = "";
        html += "<tr>";
        html += "<td><input type='text' /></td>";
        if (tag == "edit") {
            html += "<td><a tag='add' Aexist='false' onclick='addTr(this);'>Add</a>   <a tag='del' onclick='delTr(this);'>Delete</a></td>"
        }
        html += "</tr>";

        $("#tab_hobbies").append($(html));
    }

    function delTr(obj) {
        var o = $(obj);
        if (o.parent().prev().children().val() == "") {
            o.parent().parent().remove();
        }
        else {
            if (!window.confirm("Are you sure to delete this item?")) {
                return;
            }
            o.parent().parent().remove();
        }
    }

    function submitForm()
    {
        var hos = "";
        $("#tab_hobbies input[type=text]").each(function () {
            if ($(this).val() != "") {
                hos += $(this).val() + ",";
            }
        })
        hos = hos.substring(0, hos.length - 1);

        $("#hobbies").val(hos)
    }

    InitHobbies();
</script>
